<!DOCTYPE html>
<html lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
    <meta charset="UTF-8">
    <title>一起听歌聊天</title>
    <link href="/css/xtiper_css/xtiper.css" rel="stylesheet">
    <style type="text/css">
        .box{
            width:100%;
            height:48px;
/*            border:3px solid blue;*/
            margin:0 auto;
            border-radius:5px;
        }
        .inTer{
            width:100%;
            height:430px;
/*            border:3px solid deeppink;*/
            margin:0 auto;
            margin-top:10px;
            overflow-y:auto;

        }
        textarea{
            display:block;
            width:99%;
            height:65px;
            margin:0 auto;
            margin-top:5px;
        }
        #btn{
            display:block;
            float:right;
            margin-right:10px;
            margin-top:5px;
        }
        p{
            display:inline-block;
            border-radius:5px;
            background:#dcdcdc;
            font-size:12px;
            padding:5px 5px;
            margin:5px 0;
            margin-left:5px;
            max-width:140px;
            word-wrap: break-word;
        }
        #footer {
            height: 40px;
            line-height: 40px;
            position: fixed;
            bottom: 0;
            width: 100%;
            text-align: center;
            background: #333;
            color: #fff;
            font-family: Arial;
            font-size: 12px;
            letter-spacing: 1px;
        }
    </style>
</head>
<body style="background-color: #BCCCE3;opacity: 0.9">
<div class="box">
    <div style="text-align: center;color:blue"><h5>边听边聊|<span id="count">未连接服务器</span></h5></div>
    <div class="inTer" id="father">
        <p>现在您可以开始聊天啦</p ></br>
    </div>
    <span style="color: whitesmoke">昵称:</span><input type="text" id="nickname" style="	border-radius:5px;">
    <textarea style="resize: none;	border-radius:5px;" id="txt">
			</textarea>
    <input type="button" id="btn"  class="form-control" value="发送[回车]" />
</div>
</body>
</html>
<script src="/js/jquery-3.4.1.min.js"></script>
<script src="/js/music_chat.js">
</script>